<!-- @format -->

<template>
	<div class="ma-content-block lg:flex justify-between p-4">
		<!-- CRUD 组件 -->
		<ma-crud :options="options" :columns="columns" ref="crudRef"> 
			<template #operationBeforeExtend="{ record }">
				<a-link @click="handleEdit(record)" v-if="record.ticket_status == 2" v-auth="['prediction:station:convertPrediction']">转预报</a-link>
			</template>
		</ma-crud>

		<!-- 转预报弹窗 -->
		<a-modal :mask-closable="false"  v-model:visible="editShow" title="转预报" @cancel="handleeditShow" :width="1000"  v-if="editShow" :on-before-ok='handleBeforeOk'>
			<a-form :model="rowData" :rules="rules">
				<a-row :gutter="16">
					<a-col :span="24">
						<a-form-item field="name" label="原票号" label-col-flex="80px">
							<a-input v-model="rowData.ticket_number"  placeholder="请输入原票号" />
						</a-form-item>
					</a-col>
					
				</a-row>
				<a-row :gutter="16">
					<a-col :span="8">
						<a-form-item field="name" label="公司名称" label-col-flex="80px">
							<!-- <a-input v-model="rowData.deptname" disabled placeholder="请输入公司名称" /> -->
							<a-select v-model="rowData.dept_id" placeholder="请选择" :filter-option="filterOption" allow-clear @change="handleGongsiChange">
								<a-option :value="items.id" v-for="(items,indexs) in gongsiList" :key="indexs">{{ items.name }}</a-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="contract_no" label="合同号" label-col-flex="80px" >
							<!-- <a-input v-model="rowData.contract_no" disabled placeholder="请输入合同号" /> -->
							<a-select v-model="rowData.contract_no" placeholder="请选择" allow-clear @change="handleHetongChange">
								<a-option :value="items.id" v-for="(items,indexs) in hetongList" :key="indexs">{{ items.name }}</a-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="goods_name" label="品名" label-col-flex="80px">
							<a-select v-model="rowData.goods_id" placeholder="请选择" :filter-option="filterOption"  allow-clear>
								<a-option :value="items.goods_id" v-for="(items,indexs) in shangpinList" :key="indexs">{{ items.name }}</a-option>
							</a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="16">
					<a-col :span="8">
						<a-form-item field="transport_type" label="运输方式" label-col-flex="80px">
							<a-select v-model="rowData.transport_type" placeholder="请选择" allow-clear>
								<a-option :value="items.key" v-for="(items,indexs) in yunshuList" :key="indexs">{{ items.title }}</a-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="serve_type" label="是否仓储" label-col-flex="80px">
							<!-- <a-input v-model="rowData.serve_type"  placeholder="请输入材料号" /> -->
							<a-select v-model="rowData.serve_type" placeholder="请选择" allow-clear>
								<a-option :value="items.key" v-for="(items,indexs) in fuwuList" :key="indexs">{{ items.title }}</a-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="car_no" label="车号" label-col-flex="80px">
							<a-input v-model="rowData.car_no"  placeholder="请输入车号" />
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="16">
					<a-col :span="8">
						<a-form-item field="producer" label="发站" label-col-flex="80px">
							<a-input v-model="rowData.producer"  placeholder="请输入发站" />
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="number" label="数量（件）" label-col-flex="80px">
							<a-input v-model="rowData.number"  placeholder="请输入数量" />
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="weight" label="重量（吨）" label-col-flex="80px">
							<a-input v-model="rowData.weight"  placeholder="请输入重量" />
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="16">
					<a-col :span="8">
						<a-form-item field="producer" label="线路" label-col-flex="80px">
							<a-input v-model="rowData.work_line"  placeholder="请输入线路" />
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item field="producer" label="车厢位置" label-col-flex="80px">
							<a-input v-model="rowData.transport_number"  placeholder="请输入车厢位置" />
						</a-form-item>
					</a-col>
					<a-col :span="8" v-if="rowData.transport_type==1">
						<a-form-item field="box" label="箱号" label-col-flex="80px">
							<a-input v-model="rowData.box"  placeholder="请输入箱号" />
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="16">
					<a-col :span="8" v-if="rowData.transport_type==1">
						<a-form-item field="box_type" label="箱型箱类" label-col-flex="80px">
							<a-input v-model="rowData.box_type"  placeholder="请输入箱型箱类" />
						</a-form-item>
					</a-col>
				</a-row>
			</a-form>
		</a-modal>

	</div>
</template>
<script setup>
	import { ref, reactive, defineEmits,onMounted } from "vue";
	import predictionStation from "@/api/prediction/predictionStation";
	import { Message } from "@arco-design/web-vue";
	import tool from "@/utils/tool";
	import { pinyin } from "pinyin-pro"
	import * as common from "@/utils/common";
	import commonApi from "@/api/common";
	import { request } from "@/utils/request.js";
  	const emits = defineEmits(['upLoadSuccess'])
	
	const crudRef = ref();
	const editShow = ref(false);
	let rowData = {};
	const yunshuList = ref([]);
	const fuwuList = ref([]);
	const duizhuangList = ref([]);
	const gongsiList = ref([]);
	const hetongList = ref([]);
	const shangpinList = ref([]);
	const open = (row) => {
		crudRef.value.requestData();
	};
	const rules = {
		ticket_number: [
        {
          required: true,
          message:'请输入原票号',
        },
      ],
      dept_id: [
        {
          required: true,
          message: "请选择公司"
        },
      ],
      contract_no: [
        {
          required: true,
          message:'请选择合同',
        },
      ],
      goods_id: [
        {
          required: true,
		  message:'请选择品名',
        }
      ],
      car_no: [
	  	{
			required: true,
		  	message:'请输入车号',
        }
      ],
	  transport_type: [
	  	{
			required: true,
		  	message:'请选择运输方式',
        }
      ],
	  serve_type: [
	  	{
			required: true,
		  	message:'请选择是否仓储',
        }
      ],
	  producer: [
	  	{
			required: true,
		  	message:'请输入发站',
        }
      ],
	  
    }
	const filterOption = (v,option)=>{
		return option.keywords.some(keywords=>keywords.includes(v))
	}
	onMounted(() => {
		commonApi.getDict("transport_type").then((res) => {
			yunshuList.value = res.data;
		});
		commonApi.getDict("serve_type").then((res) => {
			fuwuList.value = res.data;
		});
		commonApi.getDict("butt_type").then((res) => {
			duizhuangList.value = res.data;
		});
		request({
			url: "system/dept/remote",
			method: "post",
			data: {
				openPage: false,
				remoteOption: {
					filter: { type: ["=", 2],status: ['=',1] },
					relations: [],
					select: ["id", "name"],
					sort: { id: "desc" },
				},
			},
		}).then((res) => {
			res.data.map((v,i)=>{
					v.keywords = [
					v.name,
					pinyin(v.name,{toneType:'none',pattern:'first'}).split(' ').join(''),
					pinyin(v.name,{toneType:'none',pattern:'first'}).split(' ').join('').toUpperCase()
					]
			})
			gongsiList.value = res.data;
		});
	});
	const handleGongsiChange = (e)=>{
		// system/userContract/remote_prediction?dept_id=25
		request({
			url: "system/userContract/remote_prediction?dept_id=" + e,
			method: "get",
			params: {
				
			},
		}).then((res) => {
			hetongList.value = res.data;
		});
	}
	const handleHetongChange = (e)=>{
		request({
			url: "system/userContractGoods/remote_prediction?contract_id=" + e,
			method: "get",
			params: {
				
			},
		}).then((res) => {
			res.data.map((v,i)=>{
					v.keywords = [
					v.name,
					pinyin(v.name,{toneType:'none',pattern:'first'}).split(' ').join(''),
					pinyin(v.name,{toneType:'none',pattern:'first'}).split(' ').join('').toUpperCase()
					]
			})
			shangpinList.value = res.data;
		});
	}
	const numberOperation = (newValue, id, numberName) => {
		predictionStation
			.numberOperation({ id, numberName, numberValue: newValue })
			.then((res) => {
				res.success && Message.success(res.message);
			})
			.catch((e) => {
				console.log(e);
			});
	};
	const handleBeforeOk = async ()=>{
		if(rowData.ticket_number == ''){
			Message.error('请输入原票号')
			return false
		}
		if(rowData.dept_id == ''){
			Message.error('请选择公司')
			return false
		}
		if(rowData.contract_no == ''){
			Message.error('请选择合同')
			return false
		}
		if(rowData.goods_id == ''){
			Message.error('请选择品名')
			return false
		}
		
		if(rowData.car_no == ''){
			Message.error('请输入车号')
			return false
		}
		if(rowData.transport_type == ''){
			Message.error('请选择运输方式')
			return false
		}
		if(rowData.serve_type == ''){
			Message.error('请选择是否仓储')
			return false
		}
		if(rowData.producer == ''){
			Message.error('请输入发站')
			return false
		}
		let res = await predictionStation.convertPrediction(rowData)
		if(res.code == 200){
			Message.success(res.message)
			return true
		}else{
			Message.error(res.message)
			return false
		}
		
	}
	const handleTJedit = ()=>{
		
		predictionStation.convertPrediction(rowData).then(res=>{
			crudRef.value.requestData();
			if(res.code == 200){
				Message.success(res.message)
			}
			

		})
	}
	const handleeditShow = async () =>{
		editShow.value = false
	}

	const handleEdit = (row) =>{
		rowData = row
		rowData.transport_type = ''
		rowData.serve_type = ''
		rowData.butt_type = ''
		rowData.dept_id = ''
		rowData.contract_no = ''
		rowData.goods_id = ''
		rowData.box = ''
		rowData.box_type = ''

		editShow.value = true
	}

	const switchStatus = (statusValue, id, statusName) => {
		predictionStation
			.changeStatus({ id, statusName, statusValue })
			.then((res) => {
				res.success && Message.success(res.message);
			})
			.catch((e) => {
				console.log(e);
			});
	};

	const options = reactive({
		id: "flyos_prediction_station",
		rowSelection: {
			showCheckedAll: true,
		},
		pk: "id",
		operationColumn: true,
		autoRequest:true,
		operationWidth: 160,
		isDbClickEdit:false,
		formOption: {
			viewType: "modal",
			width: 600,
		},
		api: predictionStation.getList,
		recycleApi: predictionStation.getRecycleList,
		add: {
			show: false,
			api: predictionStation.save,
			auth: ["prediction:station:save"],
		},
		edit: {
			show: false,
			api: predictionStation.update,
			auth: ["prediction:station:update"],
		},
		delete: {
			show: false,
			api: predictionStation.deletes,
			auth: ["prediction:station:delete"],
			realApi: predictionStation.realDeletes,
			realAuth: ["prediction:station:realDeletes"],
		},
		recovery: {
			show: false,
			api: predictionStation.recoverys,
			auth: ["prediction:station:recovery"],
		},
		import: {
			show: true,
			url: "prediction/station/import",
			templateUrl: "prediction/station/downloadTemplate",
			auth: ["prediction:station:import"],
		},
		export: {
			show: false,
			url: "prediction/station/export",
			auth: ["prediction:station:export"],
		},
		afterImport: () => {
			crudRef.value.requestData();
      emits('upLoadSuccess');
		},
		afterRequest: (params) => {
			params.map((v, i) => {
				v.weight = (v.weight - 0).toFixed(3)
			});
		},
	});

	const columns = reactive([
		{
			title: "",
			dataIndex: "id",
			formType: "input",
			addDisplay: false,
			editDisplay: false,
			hide: true,
			commonRules: {
				required: true,
				message: "请输入",
			},
		},
		{
			title: "导入批次号",
			dataIndex: "batch_no",
			formType: "input",
			search: true,
		},
		// {
		// 	title: "是否对装",
		// 	dataIndex: "butt_type",
		// 	formType: "select",
		// 	search: true,
		// 	dict: {
		// 		name: "butt_type",
		// 		props: {
		// 			label: "title",
		// 			value: "key",
		// 		},
		// 		translation: true,
		// 	},
		// },
		{
			title: "原票号",
			dataIndex: "ticket_number",
			formType: "input",
			search: true,
		},
		{
			title: "车号",
			dataIndex: "car_no",
			formType: "input",
			search: true,
		},
		{
			title: "品名",
			dataIndex: "goods_name",
			formType: "input",
			search: true,
		},
		{
			title: "件数",
			dataIndex: "number",
			formType: "input",
			// search: true,
		},
		{
			title: "重量",
			dataIndex: "weight",
			formType: "input",
			// search: true,
		},
		{
			title: "作业线路",
			dataIndex: "work_line",
			formType: "input",
			search: true,
		},
		{
			title: "车厢顺序号",
			dataIndex: "transport_number",
			formType: "input",
			search: true,
		},
		{
			title: "状态",
			dataIndex: "ticket_status",
			formType: "select",
			search: true,
			dict: {
				data: [
					{
						label: "已匹配",
						value: "1",
					},
					{
						label: "未匹配",
						value: "2",
					},
				],
				translation: true,
			},
		},
		{
			title: "创建时间",
			dataIndex: "created_at",
			formType: "date",
			search: true,
			addDisplay: false,
			editDisplay: false,
			sortable: {
				sortDirections: ["ascend", "descend"],
				sorter: true,
			},
			showTime: true,
		},
		{
			title: "更新时间",
			dataIndex: "updated_at",
			formType: "date",
			addDisplay: false,
			editDisplay: false,
			hide: true,
			showTime: true,
		},
		{
			title: "删除时间",
			dataIndex: "deleted_at",
			formType: "date",
			addDisplay: false,
			editDisplay: false,
			hide: true,
			showTime: true,
		},
		{
			title: "创建者",
			dataIndex: "created_by",
			formType: "input",
			addDisplay: false,
			editDisplay: false,
			hide: true,
		},
		{
			title: "更新者",
			dataIndex: "updated_by",
			formType: "input",
			addDisplay: false,
			editDisplay: false,
			hide: true,
		},
	]);
	defineExpose({ open });
</script>
<script>
	export default { name: "prediction:station" };
</script>
